body{font: 14px 宋体 Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif; overflow-x: hidden;}
/*
    页眉css
*/
.header{height: 120px; line-height: 120px; position: relative; font-size: 16px;}
.header .logo,.header .welcome-text,.header .nav{position: absolute; top: 0;}
.header .logo{left: 65px;}
.header .logo span{display: none;}
.header .nav{left: 250px;}
.header .nav a{color: #3f2863; margin:0 40px;}
.header .nav a.active{color: #ff7f21;}
.header .welcome-text{right: 50px;}
.header .header-down-nav{display: none;}

/**
    内容
 */
.cont .list-item .item{margin-bottom: 10px; overflow: hidden;}
.cont .list-item .item .item-cont{ margin: 1% 5%;}
.cont .list-item .item .item-cont .go-icon{
    width: 33px;
    height: 11px;
    background: url(../img/jiantou.png) center center no-repeat;
    display: block;
    padding:10px 0;
    margin: 13px;
    float:right;
}
.cont .list-item .item .item-cont h3{font-size: 24px; margin:20px 0;}
.cont .list-item .item .item-cont h3 .new-icon{width: 36px; height: 18px; line-height: 18px; text-align: center; padding:0; margin: -3px 0 0 10px;}
.cont .list-item .item .item-cont h5{font-size: 12px; color: #ff7f21; margin-bottom: 32px;}
.cont .list-item .item .item-cont p{
    line-height: 37px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    /* autoprefixer: off */
    -webkit-box-orient: vertical;
    /* autoprefixer: on */
    text-indent: 2em;
}

/**
    页尾css
 */
.footer{
    /*background-color: #E5E5E5;*/
    border-bottom-color: #FFC40D;
    color: #555555;
    cursor: pointer;
}


.am-topbar {
    box-shadow: 0px 1px 13px 0.9px #aaa;
    /*background: rgba(226, 226, 226, 0.5);*/
    background: #fafafa;
}


.am-topbar-brand img {
    width: 40px;
    height: 40px;
    margin-bottom: 4px;
    border-radius: 50%;
}

.es {
    border: #c8c8c8 solid 1px;
}


/*主体*/
.hj-session {
    width: 90% !important;
    margin: 0 auto !important;
    padding: 0;
}

/*左侧*/
.hj-lift {
    /*margin-top: 2%;*/
}

.hj-lift > div {
    background: #c0c4cc;
    margin-top: 20px;
    position: relative;
}

.hj-lift i:first-child {
    display: block;
    position: absolute;
    left: 15px;
    top: 15px;
}

.hj-lift i:last-child {
    display: block;
    position: absolute;
    right: 15px;
    bottom: 15px;
}

.hj-notice {
    background: rgba(255, 250, 240, 0.5);
    box-shadow: 0px 0px 10px 0.5px #aaa;
}

.hj-notice p:first-child {
    padding-top: 24%;
}

.hj-notice p:last-child {
    padding-bottom: 24%;

}

.hj-notice .last {
    margin-left: -13%;
    color: #0a628f;
    font-size: 16px;
}

.hj-notice .hj-name {
    text-align: right;
}

.hj-notice p {
    padding: 8% 20%;
    text-align: center;
    color: lightslategrey;

}

.hj-message {
    background: rgba(52.94%, 80.78%, 95.16%, 0.5);
}

.hj-message p {
    color: #5c6b7a;
}
.am-nav li:hover{
    color: #7e6792;
}

/*中间*/
/*博客*/
.hj-session-content .hj-center {
    border-radius: 3%;
    background: rgba(255, 250, 240, 0.5);
    box-shadow: 0px 0px 10px 0.5px #aaa;
    margin-top: 2%;
}


.hj-session-content .qz-page {
    margin-top: 5%;
    text-align: center;
}

.hj-session-content .hj-center .qz-article {
    padding-left: 3%;
}

.hj-session-content .hj-center .qz-article h1 {
    padding-top: 3%;
}

.hj-session-content .hj-center .qz-article h1 a:hover {
    text-decoration: underline;
    color: #0a628f;
}

.qz-article .qz-tt {
    margin: 20px 0;
}

.qz-article .qz-tt .qz-mark {
    border-radius: 45%;
}

.hj-center .qz-boke {
    height: 200px;
}

.article-entry p {
    width: 94%;
    margin: 0 auto;
    text-indent: 6%;
    letter-spacing: 1px;
    font-size: 15px;
    color: #5e5f62;
}

.read-all a:hover {
    text-decoration: underline;
    color: #0a628f;
}

.article-tags {
    margin-left: 2%;
    padding-bottom: 1%;
}

.article-tags a.aa:hover {
    color: #00F7DE;
    text-decoration: underline;
}

.hj-list {
    border: 1px solid #c0c4cc;
    padding: 20px 0 0 0;
    margin-top: 25px;
    box-shadow: 2px 2px 8px #c7afc7;
    border-radius: 3%;
}

.hj-list ul li > img {
    width: 40%;
    height: 40%;
    border-radius: 50%;
    margin-left: 25%;
}
#wx_picture img{
    width: 100%;
    height: 100%;
}
#qq_picture img{
    width: 100%;
    height: 100%;
}
.picture-size{
    width: 100px;
    height: 100px;
}
.wxchat{
    position: relative;
}
#wx_picture{
    position: relative;
    /*top: 5px;*/
    left: 70%;
}
#qq_picture{
    position: relative;
    /*top: 5px;*/
    left: 45%;
}

.hj-li {
    margin-left: 40%;
    margin-top: 10px;
}

.qz-mingyan {
    width: 90%;
    margin: 15px auto;
    text-indent: 10%;
}

.qz-weixin {
    margin-left: 19% !important;
    margin: 6% 0;
}

.hj-hr {
    height: 1px;
    width: 100%;
    background: #c0c4cc;
}

.qz-icon a {
    width: 19%;
    text-align: center;
    margin-left: 5%;
    padding: 2% 0;
}
/*关于我*/
.hj-session-content .hj-art{
    background: rgba(255, 250, 240, 0.5);
    box-shadow: 0px 0px 10px 0.5px #aaa;
    margin-top: 2%;
}
.hj-session-content .hj-art .article-top{
    text-align: center;
    font-size: 180%;
    color: #480017;
    padding-top: 3%;
}
.hj-session-content .hj-art .article-info{
    text-align: center;
    margin-top: 5%;
}
.hj-session-content .hj-art .article-info .hj-mark{
    border-radius: 50%;
}
.hj-session-content .hj-art .hj-article-content{
    margin: 60px 40px 30px;
}
.hj-article-content .hj-markerDown p{
    font-size: 15px;
    color: #4d4d4d;
    font-weight: 400;
}
.hj-article-content .hj-markerDown li{
    list-style: decimal;
}


/*标签云*/
.blog-title {
    margin-left: 4%;
}

.blog-tag {
    display: inline-block;
    font-size: 16px;
    color: #307194;
    height: 30px;
    line-height: 30px;
    margin-top: 3px;
}

a.blog-tag:hover {
    text-decoration: underline;

}

/*网站信息*/
.qz-title {
    margin-left: 3%;
}

.site-default {
    margin-left: 6%;
}

.site-default li {
    margin: 10px 0;
}

/*分页*/
.qz-pagehelder {
    margin-top: 6%;
    /*display: none;*/
}

.qz-pagehelder > div {
    display: inline-block;
}

.left-page {
    float: left;
    text-align: center;
    border-radius: 3px;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 5px 6px 14px rgba(255, 192, 203, 0.5);
    transition-property: box-shadow, background-color, -webkit-box-shadow;
    transition-duration: .2s;
    background-color: pink;
    color: white;
    font-weight: 600;
    padding: 10px 40px;
    font-size: 2rem;
    line-height: 1;
}

.left-page:hover {
    box-shadow: 5px 6px 14px rgba(176, 134, 141, 0.55);
}

.right-page {
    float: right;
    text-align: center;
    border-radius: 3px;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 5px 6px 14px rgba(14, 252, 255, 0.23);
    transition-property: box-shadow, background-color, -webkit-box-shadow;
    transition-duration: .2s;
    background: rgba(52.94%, 80.78%, 95.16%, 0.5);
    color: white;
    font-weight: 600;
    padding: 10px 40px;
    font-size: 2rem;
    line-height: 1;
}

.right-page:hover {
    box-shadow: 5px 6px 14px rgba(13, 150, 153, 0.5);
}

.messVO {
    position: absolute;
    left: 5px;
    top: 3px;
    font-size: 18px;
}

.search {
    position: relative;
    line-height: 50px;
    padding: 0 10px;
}

.writeBlog {
    line-height: 50px;
    color: black;
}

.writeBlog > a:hover {
    color: #e10d13;
}
.personalSpace{
    background: white;
}

@media screen and (max-width: 1200px){
    .header .logo{left: 20px;}
    .header .nav{left: 150px;}
    .header .nav a{margin: 0 20px;}
    .content .cont .title{padding-left:10px;}
    .content .cont .list-item .item .img{padding:0 10px;}
    .content .cont .list-item .item .item-cont{padding:0 20px;}
    .content .cont .list-item .item .item-cont h3{margin:15px 0; font-size: 22px;}
    .content .cont .list-item .item .item-cont h5{margin-bottom: 10px;}
    .content .cont .list-item .item .item-cont p{line-height: 30px;}
    .content .cont .list-item .item .item-cont .go-icon{margin-top: 5px;}
    .content .cont .list-item .item{margin-bottom: 50px;}
    .content{padding:60px 0 60px 0;}
    .whisper-content{padding:0 0 60px 0;}
    .details-content .article-cont .title{padding:0;}
    .details-content .article-cont .title h3{font-size: 22px;}
}

@media screen and (max-width: 1000px){
    .leacots-content{padding:0 20px 40px 20px;}
    .album-content .img-info img{width: 100%; padding-right: 0; margin-bottom: 20px;}
    .album-content .img-info{margin-top: 0px; margin-bottom: 50px;}
    .album-content .img-list .space>*{padding:30px;}
}

@media screen and (max-width: 768px) {

    .header .nav, .header .welcome-text {
        display: none;
    }

    .whisper-content .cont .item {
        padding: 30px;
    }
    .whisper-content .cont .item-box .item {
        padding: 30px;
    }
    .content .review-version .list-cont .cont .text {
        padding-left: 0;
        line-height: 22px;
        color: #333;
    }
    .content .review-version .list-cont .cont .text .tit {
        line-height: 50px;
        margin-bottom: 0;
    }
    .content .review-version .list-cont .cont .text .tit .name {
        margin-left: 20px;
    }
    .content .review-version .list-cont .cont .text .ct {
        margin-top: 20px;
    }
    .leacots-content .review-version .form {
        margin: 40px 0;
    }
    .album-content .img-list .space > * {
        padding: 10px;
    }
    .album-content .img-list .layui-laypage {
        margin: 50px 0 0 0;
    }
    .album-content .img-list #demo {
        text-align: center;
    }
    .about-content .item.info img {
        margin-right: 0;
        float: none;
        height: auto;
        width: 100%;
    }
    .about-content .item.info p {
        padding-left: 20px;
    }
    .about-content .item {
        padding-bottom: 40px;
    }
    .about-content .item h3 {
        padding-left: 20px;
    }
    .about-content .item.contact .cont img {
        margin: 0 30px 0 20px;
    }

    .am-nav {
        padding-left: 255px;
    }

    /*menu-btn*/
    .menu {
        width: 50px;
        height: 40px;
        position: relative;
        cursor: pointer;
    }
    .menu:before, .menu:after {
        content: "";
        display: block;
        width: 50px;
        height: 6px;
        background: #ff7f21;
        border-radius: 8px;
        position: absolute;
        left: 0;
        -webkit-transition: all 0.15s ease-in-out;
        transition: all 0.15s ease-in-out;
    }
    .menu:before {
        top: 0px;
        box-shadow: 0 34px #ff7f21;
    }
    .menu:after {
        bottom: 17px;
    }
    .menu.on:before {
        top: 17px;
        box-shadow: none;
        -webkit-transform: rotate(225deg);
        transform: rotate(225deg);
    }
    .menu.on:after {
        bottom: 17px;
        -webkit-transform: rotate(135deg);
        transform: rotate(135deg);
    }
    .menu-btn {
        position: absolute;
        top: 40px;
        right: 20px;
    }


    .header .header-down-nav {
        width: 100%;
        position: absolute;
        top: 120px;
        z-index: 2;
        left: 0;
        padding: 0;
        border-radius: 0;
    }

    .header .header-down-nav {
        background: #ff7f21;
    }
    .header .header-down-nav .layui-nav-item a {
        padding: 0 40px;
    }
    .header .header-down-nav li {
        display: block;
    }

    .header .header-down-nav li a {
        font-size: 16px;
    }

    #wordsView{
        padding: 5px;
    }
}

@media screen and (max-width: 320px) {
    .whisper-content .cont .item img {
        width: 100%;
    }
}
